<template>
    <div class="course">
        <p style="color: #606266; font-size: 14px;">
            <i class="el-icon-s-home"></i>
            <span>&nbsp;信息维护</span>
        </p>

        <el-card class="box-card" :body-style="{ padding: '10px 25px' }">
            <el-form :rules="rules" :model="form" ref="form">
                <el-form-item prop="number" label="学号" label-width="80px">
                    <el-input v-model="form.number" autocomplete="off" :disabled="true"></el-input>
                </el-form-item>
                <el-form-item prop="name" label="姓名" label-width="80px">
                    <el-input v-model="form.name" autocomplete="off" :disabled="true"></el-input>
                </el-form-item>
                <el-form-item prop="departmentName" label="教学系" label-width="80px">
                    <el-input v-model="form.departmentName" autocomplete="off" :disabled="true"></el-input>
                </el-form-item>
                <el-form-item prop="majorName" label="专业" label-width="80px">
                    <el-input v-model="form.majorName" autocomplete="off" :disabled="true"></el-input>
                </el-form-item>
                <el-form-item prop="className" label="班级" label-width="80px">
                    <el-input v-model="form.className" autocomplete="off" :disabled="true"></el-input>
                </el-form-item>
                <el-form-item prop="email" label="Email" label-width="80px">
                    <el-input v-model="form.email" autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item prop="birthday" label="生日" label-width="80px">
                    <el-date-picker v-model="form.birthday" type="date" placeholder="选择日期">
                    </el-date-picker>
                </el-form-item>
                <el-form-item prop="sex" label="性别" label-width="80px">
                    <el-radio-group v-model="form.sex">
                        <el-radio :label="1">男</el-radio>
                        <el-radio :label="0">女</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item prop="password" type="password" label="密码" label-width="80px">
                    <el-input v-model="form.password" autocomplete="off" type="password"></el-input>
                </el-form-item>
                <el-form-item prop="grade" label="操作" label-width="80px">
                    <el-button type="primary" @click="editInfo">确认更新</el-button>
                </el-form-item>

            </el-form>
        </el-card>



    </div>
</template>

<script>
import { studentInfo, putInfo } from '@/api/student/course';
export default {
    components: {},
    data() {
        return {
            loading: false,
            form: {
                number: "",
                name: "",
                departmentName: "",
                majorName: "",
                className: "",
                email: "",
                birthday: "",
                sex: 1,
                password: "",
            },
            rules: {
                email: [
                    { required: true, message: "请输入邮箱", trigger: 'blur' }
                ],
                birthday: [
                    { required: true, message: "请选择生日", trigger: 'blur' }
                ]
            }

        }
    },
    methods: {
        editInfo() {
            // console.log(id);

            putInfo(this.form).then(res => {
                // console.log(res);
                if (res.code === 0) {
                    this.$message({
                        type: 'success',
                        message: res.data
                    })
                    this.getList()
                }
            })
        },

        getList() {
            this.loading = true
            studentInfo().then(res => {
                console.log(res)
                // this.$store.commit("user/updateName", res.data.name)
                if (res.code === 0) {
                    this.form = res.data
                }
            }).finally(() => {
                this.loading = false
            })
        }
    },
    mounted() {
        this.getList()
    }
}
</script>

<style lang="scss" scoped>
.course {
    height: 100%;

    .box-card {
        width: 100%;
        height: 96%;
        margin-top: 5px;
        font-size: 14px;
        display: flex;
        justify-content: center;
    }
}
</style>